<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link type="text/css" rel="stylesheet" href="css/style.css"/>
    <title>商品修改</title>
    <style type="text/css">
        .toHidden {
            display: none;
        }
    </style>
</head>
<body>
<div class="soubg">
    <div class="sou">
        <!--Begin 所在收货地区 Begin-->
        <span class="s_city_b">
        	<span class="fl">送货至：</span>
            <span class="s_city">
            	<span>四川</span>
                <div class="s_city_bg">
                	<div class="s_city_t"></div>
                    <div class="s_city_c">
                    	<h2>请选择所在的收货地区</h2>
                        <table border="0" class="c_tab" style="width:235px; margin-top:10px;" cellspacing="0"
                               cellpadding="0">
                          <tr>
                            <th>A</th>
                            <td class="c_h"><span>安徽</span><span>澳门</span></td>
                          </tr>
                          <tr>
                            <th>B</th>
                            <td class="c_h"><span>北京</span></td>
                          </tr>
                          <tr>
                            <th>C</th>
                            <td class="c_h"><span>重庆</span></td>
                          </tr>
                          <tr>
                            <th>F</th>
                            <td class="c_h"><span>福建</span></td>
                          </tr>
                          <tr>
                            <th>G</th>
                            <td class="c_h"><span>广东</span><span>广西</span><span>贵州</span><span>甘肃</span></td>
                          </tr>
                          <tr>
                            <th>H</th>
                            <td class="c_h"><span>河北</span><span>河南</span><span>黑龙江</span><span>海南</span><span>湖北</span><span>湖南</span></td>
                          </tr>
                          <tr>
                            <th>J</th>
                            <td class="c_h"><span>江苏</span><span>吉林</span><span>江西</span></td>
                          </tr>
                          <tr>
                            <th>L</th>
                            <td class="c_h"><span>辽宁</span></td>
                          </tr>
                          <tr>
                            <th>N</th>
                            <td class="c_h"><span>内蒙古</span><span>宁夏</span></td>
                          </tr>
                          <tr>
                            <th>Q</th>
                            <td class="c_h"><span>青海</span></td>
                          </tr>
                          <tr>
                            <th>S</th>
                            <td class="c_h"><span>上海</span><span>山东</span><span>山西</span><span
                                    class="c_check">四川</span><span>陕西</span></td>
                          </tr>
                          <tr>
                            <th>T</th>
                            <td class="c_h"><span>台湾</span><span>天津</span></td>
                          </tr>
                          <tr>
                            <th>X</th>
                            <td class="c_h"><span>西藏</span><span>香港</span><span>新疆</span></td>
                          </tr>
                          <tr>
                            <th>Y</th>
                            <td class="c_h"><span>云南</span></td>
                          </tr>
                          <tr>
                            <th>Z</th>
                            <td class="c_h"><span>浙江</span></td>
                          </tr>
                        </table>
                    </div>
                </div>
            </span>
        </span>
        <!--End 所在收货地区 End-->
        <div id="thisHead">
        <span class="fr">
                <span class="fl"><span v-if="loginUser.loginName===''">你好，请<a
                        href="Login.html">登录</a>&nbsp; </span><span v-else>欢迎：<span
                        style="font-weight: bolder;color: #ff3600">{{loginUser.loginName}}</span>&nbsp;&nbsp;</span><a
                        v-if="loginUser.loginName!==''" href="#" @click.prevent="loginOut()">注销</a> <a
                        href="Regist.html" style="color:#ff4e00;">免费注册</a>&nbsp;|&nbsp;<a
                        href="Member_Order.html">我的订单</a>&nbsp;|</span>
        	<span class="ss">
                <div class="ss_list">
                	<a href="#">管理中心</a>
                    <div class="ss_list_bg">
                    	<div class="s_city_t"></div>
                        <div class="ss_list_c">
                        	<ul>
                            	<li><a href="Member_Safe.html">账户管理</a></li>
                                <li><a href="NewsList.html">资讯列表</a></li>
                                <li><a href="ProductList.html">商品列表</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="ss_list">
                	<a href="#">网站导航</a>
                    <div class="ss_list_bg">
                    	<div class="s_city_t"></div>
                        <div class="ss_list_c">
                            <ul>
                                <li><a href="Member_Collect.html">我的收藏</a></li>
                                <li><a href="CategoryList.html">全部商品</a></li>
                                <li><a href="BuyCar.html">购物车</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </span>
            <span class="fl">|&nbsp;关注我们：</span>
            <span class="s_sh"><a href="#" class="sh1">新浪</a><a href="#" class="sh2">微信</a></span>
            <span class="fr">|&nbsp;<a href="#">手机版&nbsp;<img src="images/s_tel.png" align="absmiddle"/></a></span>
        </span>
        </div>
    </div>
</div>
<div class="m_top_bg">
    <div class="top">
        <div class="m_logo"><a href="Index.html"><img src="images/logo1.png"/></a></div>
        <div class="m_search">
            <form>
                <input type="text" value="" class="m_ipt"/>
                <input type="submit" value="搜索" class="m_btn"/>
            </form>
            <span class="fl"><a href="#">咖啡</a><a href="#">iphone 6S</a><a href="#">新鲜美食</a><a href="#">蛋糕</a><a
                    href="#">日用品</a><a href="#">连衣裙</a></span>
        </div>
        <div id="myHead">
            <div class="i_car">
                <div class="car_t">购物车 [ <span>{{car.totalNum}}</span> ]</div>
                <div class="car_bg">
                    <!--Begin 购物车未登录 Begin-->
                    <div v-if="loginUser.loginName==''" class="un_login">还未登录！<a href="Login.html"
                                                                                     style="color:#ff4e00;">马上登录</a>
                        查看购物车！
                    </div>
                    <!--End 购物车未登录 End-->
                    <!--Begin 购物车已登录 Begin-->
                    <div v-else-if="car.totalPrice==0" class="un_login">暂无商品！<a href="CategoryList.html"
                                                                                    style="color:#ff4e00;">购买商品</a>
                    </div>
                    <div v-else>
                        <ul class="cars">
                            <li v-for="carDetail in carDetailList">
                                <div class="img"><a href="#"><img
                                        :src="'http://192.168.126.132:8090/easyBuy/files/'+carDetail.fileName"
                                        width="58"
                                        height="58"/></a></div>
                                <div class="name"><a href="#">{{carDetail.productName}}</a></div>
                                <div class="price"><font color="#ff4e00">￥{{ carDetail.totalPrice }}</font>
                                    X{{ carDetail.totalNum }}
                                </div>
                            </li>

                        </ul>
                        <div class="price_sum">共计&nbsp; <font color="#ff4e00">￥</font><span>{{car.totalPrice}}</span>
                        </div>
                        <div class="price_a"><a :href="'BuyCar.html?id='+car.id">去购物车结算</a></div>
                        <!--End 购物车已登录 End-->
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="i_bg bg_color">
    <!--Begin 用户中心 Begin -->
    <div class="m_content">
        <div class="m_left" id="mySlide">
            <div class="left_n">管理中心</div>
            <div class="left_m">
                <div class="left_m_t t_bg1">订单中心</div>
                <ul>
                    <li><a href="Member_Order.html" class="now">订单管理</a></li>
                    <li><a href="Member_Address.html">收货地址</a></li>
                </ul>
            </div>
            <div class="left_m">
                <div class="left_m_t t_bg3">账户中心</div>
                <ul>
                    <li><a href="Member_Safe.html">账户安全</a></li>
                    <li><a href="Member_Collect.html">我的收藏</a></li>
                </ul>
            </div>
            <div class="left_m" v-if="loginUser.type===1">
                <div class="left_m_t t_bg4">用户管理</div>
                <ul>
                    <li><a href="UserList.html">用户列表</a></li>
                </ul>
            </div>
            <div class="left_m">
                <div class="left_m_t t_bg4">资讯管理</div>
                <ul>
                    <li><a href="NewsList.html">资讯列表</a></li>
                    <li><a href="NewsAdd.html" v-if="loginUser.type===1">资讯添加</a></li>
                </ul>
            </div>
            <div class="left_m" v-if="loginUser.type===1">
                <div class="left_m_t t_bg4">商品管理</div>
                <ul>
                    <li><a href="ProductList.html">商品列表</a></li>
                    <li><a href="ProductAdd.html">商品添加</a></li>
                </ul>
            </div>
            <div class="left_m" v-if="loginUser.type===1">
                <div class="left_m_t t_bg4">分类管理</div>
                <ul>
                    <li><a href="DoCategory.html">分类列表</a></li>
                </ul>
            </div>
        </div>
        <!--        aaa-->
        <div class="m_right" id="newsTable">
            <div style="height: 50px;font-size: 20px;font-weight: bolder;margin: 10px">商品修改</div>
            <table border="0" class="order_tab" style="width:930px; text-align:center; margin-bottom:30px;"
                   cellspacing="0" cellpadding="0">
                <tbody>
                <tr>
                    <td>名称：</td>
                    <td><input type="text" style="width: 300px" v-model="product.name"/></td>
                </tr>
                <tr>
                    <td>价格：</td>
                    <td>
                        <input type="text" style="width: 300px" v-model="product.price"/>/元
                    </td>
                </tr>
                <tr>
                    <td>库存：</td>
                    <td>
                        <input type="text" style="width: 300px" v-model="product.stock"/>/个
                    </td>
                </tr>
                <tr>
                    <td>类别：</td>
                    <td>
                        <p>
                            <span>一级类别：</span>
                            <select v-model="product.categoryLevel3Id">
                                <option v-if="myType.type==1" v-for="myType in category.list" :value="myType.id">
                                    {{myType.name}}
                                </option>
                            </select>
                        </p>
                        <p>
                            <span>二级分类：</span>
                            <select v-model="product.categoryLevel2Id">
                                <option value="0">--无--</option>
                                <option v-if="product.categoryLevel3Id==myType.parentId"
                                        v-for="myType in category.list" :value="myType.id">{{myType.name}}
                                </option>
                            </select>
                        </p>
                        <p :class="{'toHidden':category.isNone}">
                            <span>三级分类：</span>
                            <select v-model="product.categoryLevel1Id">
                                <option value="0">--无--</option>
                                <option v-if="product.categoryLevel2Id==myType.parentId"
                                        v-for="myType in category.list" :value="myType.id">{{myType.name}}
                                </option>
                            </select>
                        </p>

                    </td>
                </tr>
                <tr>
                    <td>描述：</td>
                    <td>
                        <textarea rows="10" cols="50" v-model="product.description"></textarea>
                    </td>
                </tr>
                <tr>
                    <td>图片：</td>
                    <td>
                        <img :src="'http://192.168.126.132:8090/easyBuy/files/'+product.fileName" width="100px"
                             height="100px">
                        <input type="file" name="fileItem" @change="handleFileUpload($event)"/>
                    </td>
                </tr>
                </tbody>
            </table>
            <p style="text-align: center">
                <button @click="toUpdate()" style="width: 100px;background-color: navajowhite">修改</button>
            </p>
        </div>
    </div>
    <!--End 用户中心 End-->
    <!--Begin Footer Begin -->
    <div class="b_btm_bg b_btm_c">
        <div class="b_btm">
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;"
                   cellspacing="0" cellpadding="0">
                <tr>
                    <td width="72"><img src="images/b1.png" width="62" height="62"/></td>
                    <td><h2>正品保障</h2>正品行货 放心购买</td>
                </tr>
            </table>
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;"
                   cellspacing="0" cellpadding="0">
                <tr>
                    <td width="72"><img src="images/b2.png" width="62" height="62"/></td>
                    <td><h2>满38包邮</h2>满38包邮 免运费</td>
                </tr>
            </table>
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;"
                   cellspacing="0" cellpadding="0">
                <tr>
                    <td width="72"><img src="images/b3.png" width="62" height="62"/></td>
                    <td><h2>天天低价</h2>天天低价 畅选无忧</td>
                </tr>
            </table>
            <table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;"
                   cellspacing="0" cellpadding="0">
                <tr>
                    <td width="72"><img src="images/b4.png" width="62" height="62"/></td>
                    <td><h2>准时送达</h2>收货时间由你做主</td>
                </tr>
            </table>
        </div>
    </div>
    <div class="b_nav">
        <dl>
            <dt><a href="#">新手上路</a></dt>
            <dd><a href="#">售后流程</a></dd>
            <dd><a href="#">购物流程</a></dd>
            <dd><a href="#">订购方式</a></dd>
            <dd><a href="#">隐私声明</a></dd>
            <dd><a href="#">推荐分享说明</a></dd>
        </dl>
        <dl>
            <dt><a href="#">配送与支付</a></dt>
            <dd><a href="#">货到付款区域</a></dd>
            <dd><a href="#">配送支付查询</a></dd>
            <dd><a href="#">支付方式说明</a></dd>
        </dl>
        <dl>
            <dt><a href="#">会员中心</a></dt>
            <dd><a href="#">资金管理</a></dd>
            <dd><a href="#">我的收藏</a></dd>
            <dd><a href="#">我的订单</a></dd>
        </dl>
        <dl>
            <dt><a href="#">服务保证</a></dt>
            <dd><a href="#">退换货原则</a></dd>
            <dd><a href="#">售后服务保证</a></dd>
            <dd><a href="#">产品质量保证</a></dd>
        </dl>
        <dl>
            <dt><a href="#">联系我们</a></dt>
            <dd><a href="#">网站故障报告</a></dd>
            <dd><a href="#">购物咨询</a></dd>
            <dd><a href="#">投诉与建议</a></dd>
        </dl>
        <div class="b_tel_bg">
            <a href="#" class="b_sh1">新浪微博</a>
            <a href="#" class="b_sh2">腾讯微博</a>
            <p>
                服务热线：<br/>
                <span>400-123-4567</span>
            </p>
        </div>
        <div class="b_er">
            <div class="b_er_c"><img src="images/er.gif" width="118" height="118"/></div>
            <img src="images/ss.png"/>
        </div>
    </div>
    <div class="btmbg">
        <div class="btm">
            备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua.com Copyright © 2015-2018 尤洪商城网 All Rights Reserved.
            复制必究 , Technical Support: Dgg Group <br/>
            <img src="images/b_1.gif" width="98" height="33"/><img src="images/b_2.gif" width="98" height="33"/><img
                src="images/b_3.gif" width="98" height="33"/><img src="images/b_4.gif" width="98" height="33"/><img
                src="images/b_5.gif" width="98" height="33"/><img src="images/b_6.gif" width="98" height="33"/>
        </div>
    </div>
</div>
<script type="text/javascript" src="js/axios.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript" src="js/car.js"></script>

<script type="text/javascript">
    const thisVue = new Vue({
        el: '#thisHead',
        data: {
            loginUser: {
                userId: '',
                loginName: '',
            }
        },methods:{
            loginOut: function () {
                window.sessionStorage.clear();
                axios({
                    url:'/api/user/exit'
                }).then(rs=>{
                    if (rs.data.code===200){
                        alert("注销成功!")
                    }else {
                        alert("注销失败！")
                    }
                })
            },
        },
        created: function () {
            let token = window.sessionStorage.getItem('token');
            if (token === '' || token === null) {
                console.log("未登录")
            } else {
                axios({
                    url: '/api/user/findUserFromRedis'
                }).then(rs => {
                    if (rs.data.code === 200) {
                        this.loginUser.userId = rs.data.user.id;
                        this.loginUser.loginName = rs.data.user.loginName;
                        if (rs.data.user.type===0){
                            alert("权限不足！")
                            window.location='Member_Safe.html'
                            return;
                        }
                    }
                })
            }
        }
    })

    const myVue = new Vue({
        el: "#newsTable",
        data: {
            category: {
                list: '',
                isNone: true,//表示二级目录是否要呈现出来
                updateInit: false,
                updateInit2: false
            },
            product: {
                myType: '0',
                img: '',
                id: '',
                name: '',
                description: '',
                price: '',
                stock: '',
                categoryLevel1Id: '0',
                categoryLevel2Id: '0',
                categoryLevel3Id: '0',
                fileItem: '',
                createTime: '',
                fileName: ''
            },
        },
        methods: {
            handleFileUpload: function (event) {
                myVue.product.fileItem = event.target.files[0];
                console.log("第一次" + myVue.product.fileItem)
            },
            toUpdate: function () {
                const name = myVue.product.name;
                const description = myVue.product.description;
                const price = myVue.product.price;
                const stock = myVue.product.stock;
                var categoryLevel3Id = myVue.product.categoryLevel3Id;
                var categoryLevel2Id = myVue.product.categoryLevel2Id;
                var id = myVue.product.id;
                var categoryLevel1Id = myVue.product.categoryLevel1Id;
                const fileItem = myVue.product.fileItem;
                if (name === '' || price === '' || stock === '') {
                    alert("内容有空，请继续填写！")
                    return;
                }
                if (!/^(0|[1-9]\d*)(\.\d{1,2})?$/.test(price)) {
                    alert("价格是一个支持两小数点的正数！")
                    return;
                }
                if (!/^\d+$/.test(stock)) {
                    alert("库存是正整数！")
                    return;
                }
                axios({
                    url: '/api/product/getPro',
                    params: {
                        categoryLevel1Id, name
                    }
                }).then(function (rs) {
                    if (rs.data.product !== null && rs.data.product.id != myVue.product.id) {
                        alert("商品名有重复，请重命名！")
                        return;
                    }

                    let formData = new FormData();
                    formData.append('name', name);
                    formData.append('id', id);
                    formData.append('description', description);
                    formData.append('price', price);
                    formData.append('stock', stock);
                    if (categoryLevel1Id == '0' && categoryLevel2Id == '0' && categoryLevel3Id != '0') {
                        formData.append('categoryLevel1Id', categoryLevel3Id);
                    }
                    if (categoryLevel1Id == '0' && categoryLevel2Id != '0' && categoryLevel3Id != '0') {
                        formData.append('categoryLevel1Id', categoryLevel2Id);
                        formData.append('categoryLevel2Id', categoryLevel3Id);
                    }
                    if (categoryLevel1Id != '0' && categoryLevel2Id != '0' && categoryLevel3Id != '0') {
                        formData.append('categoryLevel1Id', categoryLevel1Id);
                        formData.append('categoryLevel2Id', categoryLevel2Id);
                        formData.append('categoryLevel3Id', categoryLevel3Id);
                    }
                    formData.append('fileItem', fileItem);
                    console.log("第二次" + fileItem)
                    axios({
                        url: '/api/product/doUpdate',
                        method: 'POST',
                        data: formData
                    }).then(function (rs) {
                        if (rs.data.status === true) {
                            const isGo = window.confirm("修改成功，是否跳转回商品页面？")
                            if (!isGo) {
                                location.href = 'ProductUpdate.html?id=' + myVue.product.id;
                            } else {
                                location.href = 'ProductList.html';
                            }
                        } else {
                            alert("修改失败！")
                        }
                    })
                })
            }
        },
        created: function () {
            const urlParams = new URLSearchParams(window.location.search);
            const id = urlParams.get('id');
            this.product.id = id
            axios({
                url: '/api/product/getPro',
                params: {
                    id
                }
            }).then(rs => {
                this.product = rs.data.product;
                this.product.img = "http://192.168.126.132:8090/easyBuy/files" + this.product.fileName;
                if (this.product.categoryLevel2Id == '0' && this.product.categoryLevel3Id == '0') {
                    this.product.categoryLevel3Id = rs.data.product.categoryLevel1Id;
                    this.product.categoryLevel2Id = '0';
                    this.product.categoryLevel1Id = '0';
                }
                if (this.product.categoryLevel2Id != '0' && this.product.categoryLevel3Id == '0') {
                    this.product.categoryLevel3Id = rs.data.product.categoryLevel2Id;
                    this.product.categoryLevel2Id = rs.data.product.categoryLevel1Id;
                    this.product.categoryLevel1Id = '0';
                }

                axios({
                    url: '/api/type/getList',
                    params: {}
                }).then(rs => {
                    this.category.list = rs.data.typeList;
                })
            });
        },
        watch: {
            'product.categoryLevel2Id': {
                handler(newValue) {
                    if (myVue.product.categoryLevel2Id != "0") {
                        myVue.category.isNone = false;
                    } else {
                        myVue.category.isNone = true;
                    }
                    if (myVue.category.updateInit) {

                        if (myVue.product.categoryLevel2Id != "0" && myVue.product.categoryLevel3Id == "0") {
                            myVue.product.categoryLevel1Id = '0'
                        }

                        if (myVue.product.categoryLevel3Id != "0") {
                            myVue.product.categoryLevel1Id = '0'
                        }
                    }
                    myVue.category.updateInit = true
                }
            },
            'product.categoryLevel3Id': {
                handler(newValue, oldValue) {
                    if (myVue.category.updateInit2) {
                        if (oldValue != '0') {
                            myVue.product.categoryLevel1Id = '0';
                            myVue.product.categoryLevel2Id = '0';
                        }
                    }
                    myVue.category.updateInit2 = true
                }
            }
        }
    })

    new Vue({
        el: '#mySlide',
        data: {
            loginUser: {
                userId: '',
                loginName: '',
                type: ''
            }
        },
        created: function () {
            let token = window.sessionStorage.getItem('token');
            if (token === '' || token === null) {
                console.log("未登录")
            } else {
                axios({
                    url: '/api/user/findUserFromRedis'
                }).then(rs => {
                    if (rs.data.code === 200) {
                        this.loginUser.userId = rs.data.user.id;
                        this.loginUser.loginName = rs.data.user.loginName;
                        this.loginUser.type = rs.data.user.type;
                    }
                })
            }
        }
    })
</script>
</body>
</html>